<script setup lang="ts">
import {ref} from 'vue'

//导入就实现自动注册
//import BlogPost from '@/components/BlogPost.vue'
import BlogDemo from "@/components/BlogDemo.vue";

const posts = ref([
  {id: 1, title: 'My journey with Vue'},
  {id: 2, title: 'Blogging with Vue'},
  {id: 3, title: 'Why Vue is so fun'}
])

const postFontSize = ref(1)
</script>

<template>
  <u1/>
  <u2/>
  <u3/>
  <hr>
  <blog-demo></blog-demo>
  <hr>
  <div :style="{ fontSize: postFontSize + 'em' }">
    <BlogPost
        v-for="post in posts"
        :key="post.id"
        :title="post.title"
        v-on:enlarge-text="postFontSize += 0.1"
    ></BlogPost>
    <h3>abc</h3>
  </div>
</template>
